<!--
 * @Author: qm
 * @Date: 2020-12-02 12:00:00
 * @LastEditors: qm
 * @LastEditTime: 2020-12-02 12:00:00
 * @Description:
-->

<template>
  <div class="scanner">
    <van-nav-bar title="任务详情查" left-text="返回" @click-left="onClickLeft"></van-nav-bar>
    <van-row>
      <van-col span="9">
        <van-field :value="pickTaskCode" readonly />
      </van-col>
      <van-col span="4">
        <van-field :value="brandCode" readonly />
      </van-col>
      <van-col span="4">
        <van-field :value="bussinessType" readonly />
      </van-col>
      <van-col span="4">
        <van-field :value="shelvesName" readonly />
      </van-col>
      <van-col span="3">
        <van-field :value="pickQtyDesc" readonly />
      </van-col>
    </van-row>
    <van-row>
      <van-col span="8">
        <van-field label="商品" readonly />
      </van-col>
      <van-col span="6">
        <van-field label="库位" readonly />
      </van-col>
      <van-col span="4">
        <van-field label="应拣" readonly />
      </van-col>
      <van-col span="4">
        <van-field label="已拣" readonly />
      </van-col>
    </van-row>
    <div v-for="(item, index) in detailList" :key="index">
      <van-row>
        <van-col span="8">
          <van-field :value="item.sku" readonly />
        </van-col>
        <van-col span="6">
          <van-field :value="item.locationCode" readonly />
        </van-col>
        <van-col span="4">
          <van-field :value="item.allocatedQty" readonly />
        </van-col>
        <van-col span="4">
          <van-field :value="item.pickedQty" readonly />
        </van-col>
      </van-row>
    </div>
    <div style="float: right; margin-top: 8px;">
      <van-button type="default" size="small" style="margin-right: 8px" @click="closeTask" :disabled="closeTaskDis">任务关闭</van-button>
      <van-button type="default" size="small" style="margin-right: 8px" @click="reOpenTask" :disabled="reOpenTaskDis">任务重开</van-button>
    </div>
  </div>
</template>

<script>
import {mapGetters} from "vuex";
import {selectTaskManagerDetailApi, reOpenTaskApi, closeTaskApi} from "@/api/pickScan/pickTaskDetail";

export default {
  name: "taskManageHomeDetail",
  computed: {
    ...mapGetters("scanner", ["pdaScanData"]),
    ...mapGetters("user", ["userData"])
  },
  watch: {
    $route: {
      handler(route) {
        if (route.name === "taskManageHomeDetail") {
          this.headerId = this.$route.params.headerId;
          this.pickTaskCode = this.$route.params.pickTaskCode;
          this.brandCode = this.$route.params.brandCode;
          this.bussinessType = this.$route.params.bussinessType;
          if (this.$route.params.shelvesName != "undefined") {
            this.shelvesName = this.$route.params.shelvesName;
          } else {
            this.shelvesName = "";
          }
          if (this.$route.params.canPick == "0") {
            this.reOpenTaskDis = true;
            this.closeTaskDis = false;
          } else {
            this.closeTaskDis = true;
            this.reOpenTaskDis = false;
          }
          this.taskQty = this.$route.params.taskQty;
          this.pickedQty = this.$route.params.pickedQty;
          this.pickQtyDesc = this.$route.params.taskQty + "/" + this.$route.params.pickedQty;
          this.selectTaskManagerDetail();
        }
      }
    },
    deep: true
  },
  created() {
    //debugger
    this.headerId = this.$route.params.headerId;
    this.pickTaskCode = this.$route.params.pickTaskCode;
    this.brandCode = this.$route.params.brandCode;
    this.bussinessType = this.$route.params.bussinessType;
    this.taskQty = this.$route.params.taskQty;
    this.pickedQty = this.$route.params.pickedQty;
    this.pickQtyDesc = this.$route.params.taskQty + "/" + this.$route.params.pickedQty;
    if (this.$route.params.shelvesName != undefined) {
      this.shelvesName = this.$route.params.shelvesName;
    } else {
      this.shelvesName = "";
    }
    if (this.$route.params.canPick == "0") {
      this.reOpenTaskDis = true;
      this.closeTaskDis = false;
    } else {
      this.closeTaskDis = true;
      this.reOpenTaskDis = false;
    }
    this.selectTaskManagerDetail();
  },
  data() {
    return {
      headerId: "",
      pickTaskCode: "",
      brandCode: "",
      bussinessType: "",
      shelvesName: "",
      taskQty: "",
      pickedQty: "",
      pickQtyDesc: "",
      closeTaskDis: false,
      reOpenTaskDis: false,
      detailList: []
    };
  },
  methods: {
    onClickLeft() {
      this.$router.push({
        name: "taskManageHome"
      });
    },
    //查询拣货任务详情
    selectTaskManagerDetail() {
      selectTaskManagerDetailApi(this.headerId).then(response => {
        if (response.data.status) {
          this.detailList = response.data.data;
        } else {
          this.$toast.fail(response.data.message);
        }
      });
    },
    //任务重开按钮
    reOpenTask() {
      reOpenTaskApi(
        this.$root.storerWarehouseBrand.storerId,
        this.$root.storerWarehouseBrand.warehouseId,
        this.$root.storerWarehouseBrand.brandId,
        this.headerId,
        this.userData.sysUserLoginName
      ).then(response => {
        if (response.data.status) {
          this.$toast.success(response.data.message);
          this.selectTaskManagerDetail();
        } else {
          this.$toast.fail(response.data.message);
        }
      });
    },
    //任务关闭
    closeTask() {
      closeTaskApi(
        this.$root.storerWarehouseBrand.storerId,
        this.$root.storerWarehouseBrand.warehouseId,
        this.$root.storerWarehouseBrand.brandId,
        this.headerId,
        this.userData.sysUserLoginName
      ).then(response => {
        if (response.data.status) {
          this.$toast.success(response.data.message);
          this.selectTaskManagerDetail();
        } else {
          this.$toast.fail(response.data.message);
        }
      });
    }
  }
};
</script>
